body{
    min-width: 320px;
    max-width: 750px;
    width:10rem; 
    margin: 0 auto;
    line-height: 1.5;
    font-family: Arial,Helvetica;
     background: #F2F2F2;
}
@media screen and (min-width:750px) {
    html{
        //!important提升权重 以免js覆盖调他
        font-size:75px !important ;
    }
}
div{
    box-sizing: border-box;
}

.seach{
    width:10rem; 
    height: 5.12rem;//384px
    min-width: 320px;
    max-width: 750px;
    background-image: url("../img/seach.jpg");
    background-size: 100% 100%;
    background-repeat: no-repeat;

}

.top-lis{
    margin: 0px auto;
    // background-color: chartreuse;
    height: 2.08rem;//156
    width: 9.013333rem;//676
    min-width: 246px;
    max-width: 676px;
    display: flex;
    >div{
        color: #000;
        margin-top: .4rem;//30
       width: 2.786667rem;//209
       height: 1.2rem;//90px 
       line-height: 1.2rem;
       text-align: center;
       background-color:#fddf00 ;
       margin-right: .386667rem;//29
       border-radius: .2rem;//15
       font-size: .36rem !important;//27
      
    }
    >div:nth-child(1){
        color: #fff;
        background-color:#003a9b ;
    }
    >div:nth-child(3){
        margin-right: 0px;
    }
    
}
.tit{
    // background-color: powderblue;
    margin: 0px auto;
    height: .573333rem;//43
    line-height: .573333rem;
    width: 9.013333rem;//676
    min-width: 246px;
    max-width: 676px;
    font-size: .506667rem !important;//38
    font-weight: bold;
    >span{
        color:#bcbcbc ;
        font-size: .32rem !important;//24
        font-weight: normal;
        
    }
}
ul{
    list-style: none;
    margin: 0px;
    padding: 0px;
}
.nav-one{
    margin: .533333rem auto;//40px
    height: 4.173333rem;//313
    width: 9.013333rem;//676
    min-width: 246px;
    max-width: 676px;
    display: flex;
    >div{
        height: 4.173333rem;//313
        width: 2.773333rem;//208px
        border: 1px solid #d3cece;
        margin-right: .24rem;//18px
        border-radius: .2rem;//15
        overflow: hidden;
        >i{
            display: block;
            height: 1.866667rem;//140px
            width: 100%;
            >img{
                width: 100%;
                height: 100%;
            }
        }

        >ul{
            width:calc( 100% - .533333rem);
            padding:0px .266667rem ;//20
            >li:nth-child(1){
                // background-color: paleturquoise;
                width:100%;
                // padding-left: .266667rem;//20
                height: .666667rem;//50
                position: relative;
                >img{
                    position: absolute;
                    top: .213333rem;//16
                    // left: .32rem;//24
                    width: .4rem;//30px
                    height: .266667rem;//20
                    border: 1px solid #d3cece;
                }
            }
            >li:nth-child(2){
                height: .933333rem;//70px
                font-size: .266667rem;//20
            }
            >li:nth-child(3){
                // background-color: palevioletred;
                width: 100%;
                height: .746667rem;//56
                position: relative;
                >div:nth-child(1){
                    color: #e4007b;
                    height: 100%;
                    line-height:.746667rem ;
                    font-size: .4rem;//3px
                }
                >div:nth-child(2){
                    position: absolute;
                    right:0;
                   top: 0px;
                    >img{
                        width: .666667rem;//50
                        height: .6rem;//45
                    }
                }
            }
        }
    }
    >div:last-child{
        margin-right: 0;//20
    }

}

.nav-two{
    margin: .533333rem auto;//40px
    // height: 4.173333rem;//313
    width: 9.013333rem;//676
    min-width: 246px;
    max-width: 676px;
    display: flex;
    flex-wrap: wrap;
    >div{
        // flex: 48%;
        height: 5.68rem;//426
        width: 4.226667rem;//317
        border: 1px solid #d3cece;
        margin-right: .28rem;//21
        margin-bottom: .24rem ;//18
        border-radius: .2rem;//15
        overflow: hidden;
        >i{
            display: block;
            height: 3.12rem;//234
            width: 100%;
            >img{
                width: 100%;
                height: 100%;
            }
        }
        >ul{
            width:calc( 100% - .533333rem);
            padding:0px .266667rem ;//20
            >li:nth-child(1){
                // background-color: paleturquoise;
                width:100%;
                // padding-left: .266667rem;//20
                height: .666667rem;//50
                position: relative;
                >img{
                    position: absolute;
                    top: .213333rem;//16
                    // left: .32rem;//24
                    width: .4rem;//30px
                    height: .266667rem;//20
                    border: 1px solid #d3cece;
                }
            }
            >li:nth-child(2){
                height: .933333rem;//70px
                font-size: .266667rem;//20
               
            }
            >li:nth-child(3){
                // background-color: palevioletred;
                width: 100%;
                height: .746667rem;//56
                position: relative;
                >div:nth-child(1){
                    color: #e4007b;
                    height: 100%;
                    line-height:.746667rem ;
                    font-size: .4rem;//3px
                }
                >div:nth-child(2){
                    position: absolute;
                    right:0;
                   top: 0px;
                    >img{
                        width: .666667rem;//50
                        height: .6rem;//45
                    }
                }
            }

        }
       
    }
    >div:nth-child(2){
        margin-right: 0;//20
    }
    >div:nth-child(4){
        margin-right: 0;//20
    }

}